<style>
.k-grid td {
    white-space: nowrap;
    overflow: hidden;
}
 
.k-grid table {
    table-layout: fixed;
}

.k-edit-form-container
{
	text-align:center;
	width:100%;
}
</style>
<script type="text/javascript" src="/js/app/hyip.js"></script>

<script>   
    var grid = null;
    var gridMonitor = null;
	var windowPlan = null;
	
    $(document).ready(function() {
		$("#_status").kendoComboBox();        
        $("#_planType").kendoComboBox();
        $("#_profitType").kendoComboBox();
        $("#_country").kendoComboBox();
        $("#_monitor").kendoComboBox();
		
        grid = new Hyip.Grid("grid");		
		
		$("#tabstrip").kendoTabStrip();
		
            $("#monitorDomain").kendoComboBox({
            index: 0,
            placeholder: "Select monitor",
            dataTextField: "domain",
            dataValueField: "id",
            filter: "contains",
            dataSource: {
                transport: {
                    read: {
                        url: "/hyip/getMonitorValues",
                        dataType: "json"
                    }
                }
            }
        });
		
		windowPlan = $("#windowPlan");

        if (!windowPlan.data("kendoWindow")) {
            windowPlan.kendoWindow({
                width: 680,
                maxHeight: 500,
                title: "View",                
                close: function() {                    
                }
            });
        }
    });
    
    function btnSearchClick()
    {
        grid.refresh();
    } 
	
	function clearPaymentMethod()
    {
        $("[name='_paymentMethod']").prop('checked', false);
    }
	
	function showWindowPlan(id){
        var window = windowPlan.data("kendoWindow");                

        window.refresh({
            url: "/hyip/view",
            data: { id: id }
        });
        
        windowPlan.data("kendoWindow").center();
        windowPlan.data("kendoWindow").open();
        
        $("#windowPlan").closest(".k-window").css({
            top: 50            
        });
        
         $("html, body").animate({ scrollTop: 0 }, "fast");

        return false;
    }
</script>

<script id="teamEditorTemplate" type="text/x-kendo-template">
<div style="width:720px;">
<dl>
	<dt ><label for="domain">Domain: </label></dt>
	<dd ><input type="text" class="k-textbox" name="domain" data-bind="value:domain"/></dd>
	<dt >Status: </dt>
	<dd >
		<select name="status" data-bind="value:status" data-role="dropdownlist">
			<option>New</option>
			<option>Paying</option>
			<option>Monitor</option>
			<option>Invest</option>
			<option>Invested</option>
			<option>Scam</option>
		</select>
	</dd>
	<dt >IP: </dt>
	<dd ><input type="text" class="k-textbox" name="ip" data-bind="value:ip" /></dd>
        <dt >Country: </dt>
        <dd >
		<select name="hostCountry" data-bind="value:hostCountry" data-role="combobox">
                    <option>Unknow</option>
                    <option>USA</option>
                    <option>Netherlands</option>                    
                    <option>Europe</option>
                    <option>Thailand</option>
                    <option>Russian</option>
                    <option>India</option>
                    <option>Belize</option>
                    <option>UK</option>
                    <option>Germany</option>
                    <option>Ukraine</option>
                    <option>Malaysia</option>
		</select>
	</dd>
	<dt >Start date: </dt>
	<dd ><input id="startDate" name="startDate" data-bind="value:startDate" data-role="datepicker" data-format="dd/MM/yyyy" /></dd>
	<dt >End date: </dt>
	<dd ><input id="endDate" name="endDate" data-bind="value:endDate" data-role="datepicker" data-format="dd/MM/yyyy"/></dd>	
	<dt >Joined date: </dt>
	<dd ><input id="joinedDate" name="joinedDate" data-bind="value:joinedDate" data-role="datepicker" data-format="dd/MM/yyyy"/></dd> 	
        <dt>Plan time</dt>
	<dd style="text-align:left; padding-left:18px;"> 
            <input data-bind="value:planTime" data-role="numerictextbox" style="width:140px;"/> (days)
        </dd> 
        
        <dt >Adv: </dt>
	<dd>
             <select name="adv" data-bind="value:adv" data-role="dropdownlist">
                <option></option>
                <option>Low</option>
                <option>Medium</option>
                <option>High</option>
                <option>Best</option>
            </select>
        </dd>
	<dt>Monitor: </dt>
	<dd>
             <select name="monitor" data-bind="value:monitor" data-role="dropdownlist">
                <option></option>
                <option>Trial</option>
                <option>General</option>
                <option>Trusted</option>
                <option>Best</option>
            </select>
        </dd>
         	   
        <dt >Payment: </dt>
	<dd>
            <select name="payment" data-bind="value:payment" data-role="dropdownlist">
                <option></option>
                <option>Low</option>
                <option>Medium</option>
                <option>High</option>
            </select>
        </dd>
	<dt>Feature: </dt>
	<dd>
            <select name="feature" data-bind="value:feature" data-role="dropdownlist">
                <option></option>
                <option>Low</option>
                <option>Medium</option>
                <option>High</option>
            </select>
        </dd>	
        	
	<dt>Plan: </dt>	
	<dd>
		<textarea rows="10" cols="30" style="width:600px;height:300px" data-bind="value:plan" data-role="editor"></textarea>
	</dd>
</dl>
<div style="clear:both;"></div>
</div>  
</script>

<div id="tabstrip">
	<ul>
		<li class="k-state-active">
			Search
		</li>        
	</ul>
	<div id="frmSearch" class="form" style="width:700px;">
		<dl>         
		    <dt class="first"><label for="_domain">Domain: </label></dt>
		    <dd class="first"><input type="text" class="k-textbox" id="_domain" /></dd>
		             
		    <dt class="second">Status: </dt>
		    <dd class="second">
		        <select id="_status">
                            <option value="">All</option>
		            <option>New</option>
		            <option>Paying</option>
                            <option>Monitor</option>
                            <option selected="selected">Invest</option>
                            <option>Invested</option>
		            <option>Scam</option>
		        </select>
		    </dd>		    
		    <dt class="first">IP: </dt>
		    <dd class="first"><input type="text" class="k-textbox" id="_ip" /></dd>
                    <dt class="second">Plan type: </dt>
		    <dd class="second">
		        <select id="_planType">
                            <option value="" selected="selected">All</option>
		            <option>One day</option>
		            <option>Short time</option>
                            <option>Medium time</option>
                            <option>Long time</option>					
		        </select>
		    </dd>
                    <dt class="first">Country: </dt>
		    <dd class="first">
		        <select id="_country">
                            <option value="" selected="selected">All</option>
		            <option>USA</option>
                            <option>Netherlands</option>                    
                            <option>Europe</option>				
                            <option>Thailand</option>
                            <option>Russian</option>
                            <option>India</option>
                            <option>Belize</option>
                            <option>UK</option>
                            <option>Germany</option>
                            <option>Ukraine</option>
                            <option>Malaysia</option>
		        </select>
		    </dd>
                    <dt class="second">Monitor: </dt>
		    <dd class="second">
		        <select id="_monitor">
                            <option value="" selected="selected">All</option>
                            <option>Trial</option>
                            <option>General</option>
                            <option>Trusted</option>
                            <option>Best</option>
		        </select>
		    </dd>
		</dl>
	    <div style="text-align:center;">
	        <button class="k-button long" onclick="btnSearchClick();">Search</button>
	    </div>
	</div>	
</div>
<div id="grid" style="height:600px;"></div>
<div id="windowPlan" style="display:none;"></div>
